﻿@model CategoryModel
@using Nop.Core.Domain.Common
@using Nop.Core.Domain.Seo
@inject Nop.Core.IWebHelper webHelper
@inject SeoSettings seoSettings
@inject CommonSettings commonSettings
@{
    Layout = "_ColumnsTwo";

    //title
    Html.AddTitleParts(!string.IsNullOrEmpty(Model.MetaTitle) ? Model.MetaTitle : Model.Name);
    //meta
    Html.AddMetaDescriptionParts(Model.MetaDescription);
    Html.AddMetaKeywordParts(Model.MetaKeywords);
    //page class
    Html.AppendPageCssClassParts("html-category-page");

    if (seoSettings.CanonicalUrlsEnabled)
    {
        var categoryUrl = Url.RouteUrl("Category", new { SeName = Model.SeName }, webHelper.CurrentRequestProtocol).ToLowerInvariant();
        Html.AddCanonicalUrlParts(categoryUrl, seoSettings.QueryStringInCanonicalUrlsEnabled);
    }

    var breadcrumbDelimiter = commonSettings.BreadcrumbDelimiter;
}
@*category breadcrumb*@
@section Breadcrumb
    {
    @if (Model.DisplayCategoryBreadcrumb)
    {
        <div class="breadcrumb">
            <ul itemscope itemtype="http://schema.org/BreadcrumbList">
                <li>
                    <a href="@Url.RouteUrl("Homepage")" title="@T("Categories.Breadcrumb.Top")">@T("Categories.Breadcrumb.Top")</a>
                    <span class="delimiter">@breadcrumbDelimiter</span>
                </li>
                @{ int position = 1; }
                @foreach (var cat in Model.CategoryBreadcrumb)
                {
                    var isLastCategory = cat.Id == Model.Id;
                    <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
                        @if (isLastCategory)
                        {
                            <strong class="current-item" itemprop="name">@cat.Name</strong>
                            <span itemprop="item" itemscope itemtype="http://schema.org/Thing"
                                  id="@Url.RouteUrl("Category", new {SeName = cat.SeName})">
                            </span>
                        }
                        else
                        {
                            <a href="@Url.RouteUrl("Category", new { SeName = cat.SeName })" title="@cat.Name" itemprop="item">
                                <span itemprop="name">@cat.Name</span>
                            </a>
                            <span class="delimiter">@breadcrumbDelimiter</span>
                        }
                        <meta itemprop="position" content="@position" />
                    </li>
                    position++;
                }
            </ul>
        </div>
        @await Component.InvokeAsync("Widget", new { widgetZone = PublicWidgetZones.CategoryDetailsAfterBreadcrumb, additionalData = Model })
    }
}
<div class="page category-page">
    <div class="page-title">
        <h1>@Model.Name</h1>
    </div>
    <div class="page-body">
        @await Component.InvokeAsync("Widget", new { widgetZone = PublicWidgetZones.CategoryDetailsTop, additionalData = Model })
        @*description*@
        @if (!string.IsNullOrWhiteSpace(Model.Description))
        {
            <div class="category-description">
                @Html.Raw(Model.Description)
            </div>
        }
        @await Component.InvokeAsync("Widget", new { widgetZone = PublicWidgetZones.CategoryDetailsBeforeSubcategories, additionalData = Model })
        @*subcategories*@
        @if (Model.SubCategories.Count > 0)
        {
            <div class="category-grid sub-category-grid">
                <div class="item-grid">
                    @foreach (var item in Model.SubCategories)
                    {
                        <div class="item-box">
                            <div class="sub-category-item">
                                <h2 class="title">
                                    <a href="@Url.RouteUrl("Category", new { SeName = item.SeName })" title="@item.PictureModel.Title">
                                        @item.Name
                                    </a>
                                </h2>
                                <div class="picture">
                                    <a href="@Url.RouteUrl("Category", new { SeName = item.SeName })" title="@item.PictureModel.Title">
                                        <img alt="@item.PictureModel.AlternateText" src="@item.PictureModel.ImageUrl" title="@item.PictureModel.Title" />
                                    </a>
                                </div>
                            </div>
                        </div>
                    }
                </div>
            </div>
        }
        @await Component.InvokeAsync("Widget", new { widgetZone = PublicWidgetZones.CategoryDetailsBeforeFeaturedProducts, additionalData = Model })
        @*featured products*@
        @if (Model.FeaturedProducts.Count > 0)
        {
            <div class="product-grid featured-product-grid">
                <div class="title">
                    <strong>@T("Products.FeaturedProducts")</strong>
                </div>
                <div class="item-grid">
                    @foreach (var item in Model.FeaturedProducts)
                    {
                        <div class="item-box">
                            @await Html.PartialAsync("_ProductBox", item)
                        </div>
                    }
                </div>
            </div>
        }
        @await Component.InvokeAsync("Widget", new { widgetZone = PublicWidgetZones.CategoryDetailsAfterFeaturedProducts, additionalData = Model })
        @if (Model.Products.Count > 0)
        {
            @await Html.PartialAsync("_CatalogSelectors", Model.PagingFilteringContext)
        }
        @await Component.InvokeAsync("Widget", new { widgetZone = PublicWidgetZones.CategoryDetailsBeforeFilters, additionalData = Model })
        <div class="product-filters">
            @*filtering*@
            @if (Model.PagingFilteringContext.PriceRangeFilter.Enabled)
            {
                @await Html.PartialAsync("_FilterPriceBox", Model.PagingFilteringContext.PriceRangeFilter)
            }
            @*filtering*@
            @if (Model.PagingFilteringContext.SpecificationFilter.Enabled)
            {
                @await Html.PartialAsync("_FilterSpecsBox", Model.PagingFilteringContext.SpecificationFilter)
            }
        </div>
        @await Component.InvokeAsync("Widget", new { widgetZone = PublicWidgetZones.CategoryDetailsBeforeProductList, additionalData = Model })

        @if (Model.Products.Count > 0)
        {
            <div class="@(Model.PagingFilteringContext.ViewMode == "list" ? "product-list" : "product-grid")">
                <div class="item-grid">
                    @foreach (var product in Model.Products)
                    {
                        <div class="item-box">
                            @await Html.PartialAsync("_ProductBox", product)
                        </div>
                    }
                </div>
            </div>
        }
        @{
            var pager = Html.Pager(Model.PagingFilteringContext).QueryParam("pagenumber");
        }
        @if (!pager.IsEmpty())
        {
            <div class="pager">
                @pager
            </div>
        }
        @await Component.InvokeAsync("Widget", new { widgetZone = PublicWidgetZones.CategoryDetailsBottom, additionalData = Model })
    </div>
</div>
